import useLanguageStore from '@/stores/language'
import en from 'element-plus/es/locale/lang/en'
import zhCn from 'element-plus/es/locale/lang/zh-cn'
import zhTw from 'element-plus/es/locale/lang/zh-tw'
import { changeLanguages } from '@/config/languages/i18n'
import { AvailableLocales } from '@/config/languages/types'

const useLanguage = () => {
  const languages: { [key: string]: any } = {
    en,
    zh: zhCn,
    tw: zhTw,
  }

  const languageStore = useLanguageStore()

  const updateLanguage = (lang: AvailableLocales) => {
    languageStore.updateLanguage(lang)
    changeLanguages(lang)
  }

  return {
    updateLanguage,
    language: computed(() => languageStore.language),
    locale: computed(() => {
      return languages[languageStore.language]
    }),
  }
}

export default useLanguage
